<template>
	<div>
		<img class="img" :src="promoterConfig.image"/>
		<div>
			<van-form validate-first @submit="onSubmit">
			  <!-- 通过 pattern 进行正则校验 -->
			  <van-field
			    label="姓名"
			    v-model="name"
				name="name"
				maxlength="20"
				required
			    placeholder="请输入姓名"
			    :rules="[{ required: true}]"
			  />
			  <!-- 通过 validator 进行函数校验 -->
			  <van-field
				label="手机号"
			    v-model="mobile"
				name="mobile"
				maxlength="11"
				required
			    placeholder="请输入手机号"
			    :rules="[{ required: true},
				{ pattern:patternMobile, message: '请输入正确的手机号' }]"
			  />
			  <div style="margin: 16px;">
			    <van-button round block type="info" native-type="submit">提交</van-button>
			  </div>
			</van-form>
		</div>
	</div>
</template>

<script>
	//已引入vuex
	import { Dialog } from 'vant'
	import { mapGetters, mapActions, mapState } from 'vuex'
	export default{
		data() {
			return{
				src:'http://youmihuodongbao.oss-cn-hangzhou.aliyuncs.com/UMI_20210803183443_be58ed26feeb87608aa80860bd7b38d4.jpeg',
				name: '',
				mobile: '',
				patternMobile: /1\d{10}/,
			}
		},
		computed: {
			...mapGetters(['promoterConfig','promoterItema']),
			...mapState(['p_promoter_id'])
		},
		mounted(){
			const params = {
				openid: ''
			}
			if (process.env.NODE_ENV == "production") {
				//线上环境
				params.openid = localStorage.getItem("OPENID") || "没获取到";
				
				} else {
				params.openid = this.$store.state.openid;
			}
			this.GET_promoterItema(params).then(res=>{
				if(this.promoterItema&&this.promoterItema.status==1){
					Dialog.alert({
					title: "系统提示",
					message: "您已是推广员",
					// showCancelButton:true
					}).then(() => {
						// on close
						this.$router.push('/promoter')
					});
				}else if(this.promoterItema&&this.promoterItema.status==2){
					Dialog.alert({
					title: "系统提示",
					message: "您的申请正在审核当中，请耐心等待",
					// showCancelButton:true
					}).then(() => {
						// on close
						this.$router.push('/promoter')
					});
				}else if(this.promoterItema&&this.promoterItema.status==3){
					this.$router.push('/promoter/bePromoterResult')
				}
			})
			
			this.GET_promoterConfig()
		},
		methods:{
			...mapActions(['GET_promoterConfig', 'GET_promoterItema']),
			// 校验函数返回 true 表示校验通过，false 表示不通过
			validator(val) {
			  return /1\d{10}/.test(val);
			},
			onSubmit(values) {
			  const userInfo = JSON.parse(localStorage.getItem('userInfo'))
			  const addParam = {
				openid: userInfo.openid,
				avatar: userInfo.avatar,
				nickname:userInfo.nickname,
				// pid: this.$route.query.pid, //上级ID
			  }
			if(this.p_promoter_id){
				addParam.pid = this.p_promoter_id //上级ID
			}
			  let params = Object.assign({}, values, addParam)
			  console.log('params', params);
			  this.$request.PromoterSave(params).then(res=>{
				  if(res.ret == 200) {
					  this.$router.push('/promoter/bePromoterSubmit')
				  }
			  })
			},
		}
	}
</script>

<style>
</style>
